<!--询比价管理页面-->
<template>
  <div>
    <table-ext :columns="columns" :searchForm="searchForm" :config="config" ref="tableExt">
      <template slot="table-action">
        <el-button type="info" @click="addRfq">新增</el-button>
      </template>
    </table-ext>
  </div>
</template>

<script>
  import TableExt from '@/components/common/table-ext/table-ext.vue';
  import SelectTable from '@/components/common/select-ext/select-table';
  import TableIcon from '@/components/common/table-ext/table-icon';
  import qs from 'qs';

  export default {
    // 引入自定义表格组件
    components: {
      'table-ext': TableExt,
      SelectTable
    },
    data() {
      return {
        isShow: false,
        form: {},
        data: [],

        config: { // 页面共通配置
          title: '询价单管理', //页面标题
          isPage: true, //是否分页
          isNo: true, //是否显示序号
          selection: true, //是否显示复选框
          crudMapping: { // CRUD方法
            query: {
              url: this.lib.config.host.rfq + '/ctmgt/rfq/enquiry/query'
            },
            publish: {
              url: this.lib.config.host.rfq + '/ctmgt/rfq/enquiry/publish'
            }
          }
        },
        // 查询表单配置
        searchForm: [
          {
            label: '采购组织',
            key: 'purOrgName',
            // 下拉多选
            type: 'select',
            dict: [{
              key: '2',
              value: '采购组织1'
            }, {
              key: '1',
              value: '采购组织2'
            }]
          },
          {
            label: '采购组',
            key: 'purGroupName',
            // 下拉多选
            type: 'select',
            dict: [{
              key: '0',
              value: '采购组1'
            }, {
              key: '1',
              value: '采购组2'
            }]
          },
          {
            label: '询价单号',
            key: 'psNo',
            type: 'input'
          },
          {
            label: '询价主题',
            key: 'psTitle',
            type: 'input',
          }
        ],
        // 表格列定义
        columns: [{
          width: '120px',
          label: '操作', // 表格header
          render: (createElement, params) => { // 动态渲染，click事件示例
            if (params.row.publishStatus == 1 || params.row.publishStatus.checkStatus == 1) {
              return false
            }
            else {

              let _this = this;

              return createElement('div', {
                width: "150px"
              }, [
                createElement('el-button', {
                  props: {
                    type: 'text',
                  },
                  on: {
                    click() {
                      _this.deleteRfq(params.row.id);
                    }
                  }
                }, '删除')
              ]);
            }

          }
        },
          {
            label: '询价单号',
            key: 'psNo',
            width: '150px',
            align: 'center',
            render: (createElement, params) => { // 动态渲染，click事件示例
              let _this = this;
              return createElement('div', {},
                [createElement('a', {
                  style: {color: '#409EFF', cursor: 'pointer'},
                  on: {
                    click() {
                      _this.detailTo(params.row.id,params.row.quoLimitTime,params.row.submitCompStatus);
                    }
                  }
                }, params.row.psNo)]
              );
            }
          },

          {
            label: '采购组织',
            key: 'purOrgName',
            width: "auto",
            align: 'center'
          },
          {
            label: '采购组',
            key: 'purGroupName',
            width: "150px",
            align: 'center'
          },
          {
            label: '品类',
            key: 'categoryName',
            width: "auto",
            align: 'center', width: '150px'
          },
          {
            label: '询价主题',
            key: 'psTitle',
            width: "auto",
            align: 'center', width: '180px'
          },
          {
            label: '采购类型',
            key: 'purchaseTypeName',
            width: "auto",
            align: 'center'
          },
          {
            label: '报价截止时间',
            key: 'quoLimitTime',
            width: "150px",
            align: 'center'
          },
          {
            label: '采购申请号',
            key: 'purReqNo',
            width: "auto",
            align: 'center'
          },
          {
            label: '发布状态',
            key: 'publishStatus',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.publishStatus,
                  titles: [{
                    status: 0,
                    title: '未发布'
                  }, {
                    status: 1,
                    title: '已发布'
                  }]
                }
              });
            },
            width: "auto",
            align: 'center'
          },
          {
            label: '审核状态',
            key: 'checkStatus',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.checkStatus,
                  titles: [{
                    status: 0,
                    title: '未审核'
                  }, {
                    status: 1,
                    title: '已审核'
                  }]
                }
              });
            },
            width: "auto",
            align: 'center'
          },


        ]
      }
    },
    created(){
      if(this.$route.query){
        this.config.crudMapping.query.data = this.$route.query;
      }
    },
    mounted() {
      this.query();
    },
    handleSelectionChange(val) {

      //this.multipleSelection = val;
    },
    methods: {

      //查询询价列表
      query() {
        this.axios.post(this.lib.config.host.rfq + '/ctmgt/rfq/enquiry/query', {}).then((res) => {
          this.data = res.data;
        })
      },
      //跳到详情
      detailTo(id,quoLimitTime,submitCompStatus) {
        this.$router.push({
          path: '/Index/Rfq/EnquirySteps',
          query: {
            id: id,
            quoLimitTime:quoLimitTime,
            submitCompStatus:submitCompStatus,
            step: 1
          }
        })
        //window.open(`/FactoryInspectItem?id=${id}&inspectNo=${inspectNo}`)
      },
      //新增询比价
      addRfq() {
        this.$router.push({
          path: '/Index/Rfq/AddRfqEnquiry',
        })
      },
      //删除询价单
      deleteRfq(id) {
        this.axios.post(this.lib.config.host.rfq + "/ctmgt/rfq/enquiry/delete/" + id)
          .then((response) => {
            this.$refs['tableExt'].refreshTable();
            this.$message({type: 'success', message: '删除成功!'});
          }).catch((error) => {
          this.$message({type: 'info', message: '删除失败'});
        });
      }
    }
  }
</script>
